/**
 * @author:linjiye
 * @date:2025/3/8
 * @desc:
 **/

import {StyleSheet, Text, View} from 'react-native'
import React, {useEffect, useState} from 'react'
import {Video} from "expo-av";
import {useLocalSearchParams} from "expo-router";

type Props = {}

const playVideo = (props: Props) => {
    // 定义视频对象的状态
    const [video, setVideo] = useState(null);
    // 定义播放状态
    const [isPlaying, setIsPlaying] = useState(false);

    const {url} = useLocalSearchParams()
    console.log('url',url)

    useEffect(() => {
        console.log('url',url)
        if (video) {
           setTimeout(() => {
               video.playAsync();
           },1000)
        }
    },[url])

    // 处理视频加载完成的函数
    const onLoad = () => {
        console.log('视频加载完成');
    };

    // 处理视频播放完成的函数
    const onPlaybackStatusUpdate = (status) => {
        if (status.didJustFinish) {
            console.log('视频播放完成');
            setIsPlaying(false);
        }
    };

    // 播放或暂停视频的函数
    const handlePlay = async (item,index) => {
        if (video) {
            if (isPlaying) {
                await video.pauseAsync();
            } else {
                await video.playAsync();
            }
            setIsPlaying(!isPlaying);
        }
        // router.push('/aiFeeding/playVideo',{
        //     item: item,
        //     index: index,
        // })
    };

    return (
        <View style={styles.container}>
            <Video
                ref={(ref) => setVideo(ref)}
                style={{width: '100%',height: 200,backgroundColor: 'rgba(0,0,0,1)'}}
                source={{
                    // uri: 'https://fcaidata.oss-cn-shenzhen.aliyuncs.com/app/1005/17414436090486c4e3e7b.mp4',
                    uri: url,
                }}
                useNativeControls
                resizeMode="cover"
                onLoad={onLoad}
                onPlaybackStatusUpdate={onPlaybackStatusUpdate}
            />
        </View>
    )
}

export default playVideo

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: "center",
        alignItems: "center",
        backgroundColor: "black",
    }
})